@vw : 3.75vw;
#details_box1{
    position: relative;
    .box1_cotent{
        position: absolute;
        top: 10vw;
        z-index: 1;
        .content_box1{
            span{
                color: white;
                width: 2vw;
                height: 2vw;
                line-height: 2vw;
                border-radius: 50%;
                background-color: rgba(3, 3, 3, 0.4);
                font-size: 6vw;
            }
        }
        .content_box2{
            text-align: right;
            span{
                color: white;
                width: 2vw;
                height: 2vw;
                line-height: 2vw;
                border-radius: 50%;
                background-color: rgba(3, 3, 3, 0.4);
                font-size: 6vw;
                margin-left: 4vw;
            }
        }
        .content_box3{
            text-align: left;
            span{
                color: white;
                width: 2vw;
                height: 2vw;
                line-height: 2vw;
                border-radius: 50%;
                background-color: rgba(3, 3, 3, 0.4);
                font-size: 6vw;
            }
        }
    }
}
#details_box2{
    position: relative;
    .details_box2_img{
        z-index: -1;
        img{
            width:100%;
        }
    }
    .box2_content{
        background-color: white;
        height: auto;
        width: 90%;
        border-radius: 10px;
        position: absolute;
        top: 50vw;
        left: 5%;
        border: 1px solid #e5e5e5;
        .deatils_content_box1{
            height: 15vw;
            line-height: 15vw;
            .content_box1_content_top{
                height: 15vw;
                div{
                    height: 15vw;
                    font-size: 3vw;
                }
            }
            .content_box1_content_bottom{
                text-align: right;
                height: 15vw;
                .icon{
                    color: #4481EB;
                    font-size: 2vw;
                }
                .gl{
                    font-size: 2vw;
                }
            }
        }
        .deatils_content_box2{
            height: 15vw;
            line-height: 15vw;
            // border: 1px solid red;
            width: 100%;
            display: flex;
            .content_box2_content_top{
                height: 15vw;
                margin: 0px;
                padding: 0px;
                div{
                    text-align: left;
                    margin: 0px;
                    padding: 0px;
                    font-size: 2vw;
                    transform: scale(0.7);
                    width: 100%;
                    margin-left: -5vw;
                    color: #262626;
                }
            }
            .content_box2_content_bottom{
                text-align: right;
                height: 15vw;
                margin: 0;
                padding: 0;
                .details_box2_bottom_content{
                    border-radius:5vw;
                    color: white;
                    background-color: #4481EB;
                    width: 80%;
                    height: 8vw;
                    line-height: 8vw;
                    display: flex;
                    margin-top: 3vw;
                    margin-left:10% ;
                    font-size: 2vw;
                    position: relative;
                    .span1{
                        color: white;
                        height: 8vw;
                        line-height: 8vw;
                        font-size: 3vw;
                        position: absolute;
                        left: 3vw;
                    }
                    .span2{
                        font-size: 2vw;
                        position: absolute;
                        left: 7vw;
                    }
                }
            }
        }
    }
}
#details_box3{
    margin-top:22vw;
    b{
        font-size: 3.5vw;
    }
    span{
        color: #262626;
        font-size: 3vw;
    }
}
#details_box4{
    overflow-x: scroll;
    white-space: nowrap;
    margin-top: 5vw;
    // border: 1px solid red;
    .details_box4_content{
        display: inline-block;
        .box4_content{
            // border: 1px solid red;
            width: 37vw;
            height: 37vw;
            margin-left: 3vw;
            display: inline-block;
            position: relative;
            img{
                position: absolute;
                width: 35vw;
                height: 23vw;
                border-radius:3vw;
            }
            .box4_content_content{
                position: absolute;
                top: 25vw;
                font-size: 2vw;
                span{
                    font-weight: bold;
                }
            }
            .details_box4_span{
                color: #4C4B53;
                width: 10vw;
                height: 10vw;
                line-height: 10vw;
                position: absolute;
                top: 6vw;
                left: 12vw;
                background-color: white;
                text-align: center;
                border-radius: 50%;
                font-size: 8.5vw;
                opacity: 0.6;
            }
        }
    }
}
#details_box5{
    // border: 1px solid red;
    height: 10vw;
    line-height: 10vw;
    .container{
        .col-xs-4{
            b{
                font-size: 3.5vw;
            }
        }
    }
}
#details_box6{
    .details_box6_content{
        // border: 1px solid red;
        height: 30vw;
        margin-top: 3vw;
        position: relative;
        img{
            border-radius: 3vw;
            position: absolute;
            width: 35vw;
            height: 25vw;
        }
        p{
            position: absolute;
            left: 39vw;
            top: 1vw;
            width: 40vw;
            // border: 1px solid red;
            font-size: 2vw;
        }
        .details_box6_content_span1{
            position: absolute;
            left: 39vw;
            top:13vw;
            font-size: 2vw;
            color: gray;
        }
        .details_box6_content_span2{
            position: absolute;
            left: 39vw;
            top: 18vw;
            font-size: 3vw;
            color: red;
            span{
                font-size: 5vw;
            }
        }
    }
}
#details_box7{
    width:20vw;
    height: 8vw;
    line-height: 8vw;
    position: fixed;
    z-index: 1;
    bottom: 3vw;
    right: 5vw;
    text-align: center;
    font-size: 2vw;
    background: linear-gradient(to top, #4184EC, #06BCFE);
    color: white;
    border-radius: 3vw;
}

// 适应平板
@media (min-width:768px) and (max-width:992px){
    #details_box2{
        .box2_content{
            .deatils_content_box1{
                .content_box1_content_top{
                    div{
                        font-size: 4vw;
                    }
                }
                .content_box1_content_bottom{
                    .icon{
                        font-size: 4vw;
                    }
                    .gl{
                        font-size: 4vw;
                    }
                }
            }
            .deatils_content_box2{
                .content_box2_content_top{
                    div{
                        font-size: 4vw;
                        margin-left: -8vw;
                    }
                }
                .content_box2_content_bottom{
                    .details_box2_bottom_content{
                        .span1{
                            font-size: 4vw;
                        }
                        .span2{
                            font-size: 4vw;
                        }
                    }
                }
            }
        }
    }
    #details_box4{
        .details_box4_content{
            .box4_content{
                .box4_content_content{
                    span{
                        font-size: 4vw;
                    }
                    div{
                        font-size: 3vw;
                    }
                }
            }
        }
    }
    #details_box6{
        .details_box6_content{
            p{
                b{
                    font-size: 3.5vw;
                }
            }
            .details_box6_content_span1{
                font-size: 3vw;
            }
            .details_box6_content_span2{
                i{
                    font-size: 4vw;
                }
                span{
                    font-size: 4vw;
                }
            }
        }
    }
    #details_box7{
        font-size: 4vw;
    }
}